<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>13_节点操作-兄弟关系</title>
    </head>
    <body>
        <ul>
            <li id="l1">心</li>
            <li>肝</li>
            <li>脾</li>
            <li id="l4">肺</li>
            <li>肾</li>
            <li>肠</li>
        </ul>

        <script>
            var l1 = document.getElementById('l1');
            // 如果没有兄弟元素节点 那么则返回null
            console.log(l1.previousElementSibling);



            var li = document.getElementById('l4');

            // (1) 上一个兄弟节点
            console.log(li.previousSibling);
            // (2) 上一个兄弟元素节点
            console.log(li.previousElementSibling);

            // (3) 下一个兄弟节点
            console.log(li.nextSibling);
            // (4) 下一个兄弟元素节点
            console.log(li.nextElementSibling);
        </script>
    </body>
</html>